import React, { useState, useEffect, useMemo } from "react";
import "./index.scss";
import { Breadcrumb } from "antd";
import VisitorRouter from "../../router/RenderRouter/visitor";
import AdminRouter from "../../router/RenderRouter/admin";
import handlerData from "../../utils/Breadcrumb";
const BreadcrumbCom = ({ currentPath }) => {
  const role = JSON.parse(window.sessionStorage.getItem("userData")).identity;
  const [data, setData] = useState([]);
  useEffect(async () => {
    const res = await handlerData(role === "访客" ? VisitorRouter : AdminRouter, currentPath);
    setData([...res]);
  }, []);
  useMemo(async () => {
    const res = await handlerData(role === "访客" ? VisitorRouter : AdminRouter, currentPath);
    setData([...res]);
  }, [currentPath]);
  const handlerClick = (path) => {
    if (path === "/article") {
      return (window.location.href = "/allarticle");
    }
    window.location.href = path;
  };
  return (
    <Breadcrumb>
      {data?.length &&
        data.map((item, index) => {
          return (
            <Breadcrumb.Item
              onClick={() => {
                handlerClick(item.path);
              }}
              key={index}
            >
              {item.title}
            </Breadcrumb.Item>
          );
        })}
    </Breadcrumb>
  );
};

export default BreadcrumbCom;
